/* 
    Document   :StyleControl
    Created on :Feb 16, 2011, 8:55:23 PM
    Author     :JoseTrujillo
    Description:
        Purpose of the stylesheet follows.
*/

/* 
   TODO customize this sample style
   Syntax recommendation http://www.w3.org/TR/REC-CSS2/
*/

*
{
    margin:0;
    padding:0;
}


body {
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:100%;
    color:#666666;
    padding:0.7em 0.3em 0.35em;
}


p {
    margin-bottom:18px;
}

a {
    color:#2D3954;
    font-size:0.8em;
}
a:hover {
    color:#0047D6;
}


h1 {
    color:#00289E;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:1.125em;
    font-weight:bold;
    margin:0px 0px 5px;
    padding:0px 0px 3px;
    border-bottom:1px dashed #E6E8ED;
}


.textfield {
    font-size:0.7em;
    color:#333333;
    background:#F7F7F7;
    border:1px solid #CCCCCC;
    padding-left:1px;
}

.err {
    color:#CC0000;
    font-weight:bold;
    text-transform:uppercase;
}
.note {
    color:#0030C2;
    font-weight:bold;
    font-size:0.8em;
}


.impact {
    color:#003DF5;
    font-weight:bold;
    text-transform:capitalize;
}

th {
    font-size:0.95em;
    font-weight:bold;
    text-align:left;
}
small
{
    font-size:0.5em;
}

#sidebar {
    min-width:200px;
    float:left;
    padding:6px;
    min-height:400px;
    background-color:#ECECEC;
    border-right:10px solid #FFFFFF;
}
#sidebar h3 {
    font-size:0.97em;
    font-weight:normal;
    background-color:#4D4D4D;
    color:#FFFFFF;
    padding:5px;
    margin-bottom:10px;
}
#sidebar li {
    font-size:0.92em;
    font-weight:normal;
    color:#FFFFFF;
    padding-left:5px;
    padding-top:1px;
}
#sidebar ul {
    list-style-type:none;
    margin-bottom:15px;
    background-color:#ffffff;
    padding:5px;
}

#mainbody {
    min-width:500px;
    min-height:400px;
    padding:5px;
}


/******** TABLES STYLE ************/

/** *************************************************************************
 * Base Table styles
*/


td.THeader {
    border-bottom:5px solid #6699CC;
    border-left:2px solid #6699CC;
    border-right:2px solid #6699CC;
    background-color:#BEC8D1;
    text-align:center;
    vertical-align:middle;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-weight:bold;
    font-size:1.0em;
    color:#404040;
    padding:5px 8px 5px 8px;
}
td.THeader a
{
    font-size:1.0em;
}

td.TBody {
    border-bottom:2px dashed #9CF;
    border-top:0px;
    border-left:1px dashed #9CF;
    border-right:1px dashed #9CF;
    text-align:left;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-weight:normal;
    font-size:1.05em;
    color:#404040;
    background-color:#fafafa;
    padding:4px 6px 4px 6px;
}
td.TBody a
{
    font-size:0.75em;
    text-align:right;
}

table.TSoft {
    text-align:left;
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-weight:normal;
    font-size:1.0em;
    color:#404040;
    background-color:#fafafa;
    border:3px #6699CC solid;
    border-collapse:collapse;
    border-spacing:0px;
}

/******** DATE PICKER ************/

#datefield2 { height:20px; }
.ui-datepicker-trigger { cursor:pointer; vertical-align:middle; }





/******** FORMS STYLE ************/

/** *************************************************************************
 * Base Form styles
*/

/* Zero out padding and margin, adjust where needed later */
form, fieldset, label, input, .checkbox, textarea, select, option, form div {
    margin:0;
    padding:0;
}
fieldset {
    margin:1em 0;
    padding:1em;
    border:1px solid #999;
}
legend {
    font-weight:bold;
    margin:0 2% .5em 0;
    padding:.2em .5em;
}
input.text, textarea, select {
    border:1px solid #666;
    border-right:1px solid #ccc;
    border-bottom:1px solid #ccc;
}
option {
    float:none;
    clear:both;
    margin-right:2em;
}
input.radio, input.checkbox {
    margin-right:.5em;
}
/* Create a bit of padding for text inputs and selects */
input.text, input.button, textarea, select {
    padding:.2em;
}
input.button {
    margin-right:1em;
    padding:.2em .6em;
}
.readonly {
    color:#999;
    background:#e7e7e7;
}
input.readonly {
    color:#999;
    background:#e7e7e7;
}


/* standard widths */
.w12 { width:12% }
.w25 { width:25% }
.w37 { width:37% }
.w50 { width:50% }
.w62 { width:62% }
.w75 { width:75% }
.w87 { width:87% }
.wauto { width:auto; }


/** *************************************************************************
 * Provide proper vertical alignment for expanded and compact forms
*/

.expandedform .row div,
.compactform div div label {
    padding-top:.5em;
}


/** *************************************************************************
 * Expanded form layout styles
*/

.expandedform { overflow:hidden; }
.expandedform .row {
    padding:.3em 0;
    white-space:nowrap;
    overflow:hidden;
    clear:both;
}
.expandedform label,
.expandedform .row p,
.expandedform .row div,
.expandedform input,
.expandedform select,
.expandedform textarea {
    float:left;
}
/* change column widths for labels and inputs */
.expandedform .text { width:80%; }
.expandedform label, .expandedform .row p {
    width:15%;
    margin:.5em 1em .5em 0;
    text-align:right;
    white-space:normal;
    overflow:hidden;
}
.expandedform .row div {
    white-space:nowrap;
    overflow:hidden;
    clear:none;
}
/* labels and form inputs inside of divs should not float */
.expandedform .row div * {
    float:none;
    clear:none;
}
.expanded input.checkbox,
.expanded input.radio,
.expanded select {
    margin-top:1.5em;
}
.expandedform div div input {
    margin-right:0;
}


/** *************************************************************************
 * Compact form layout styles
*/

.compactform { overflow:hidden; }
.compactform div,
.compactform label,
.compactform input,
.compactform select,
.compactform textarea {
    float:left;
}
.compactform input.text,
.compactform select,
.compactform textarea {
    /* set width:auto to allow form element content
	to set width otherwise 90% is a good setting */
    width:90%; /* determines space between form elements */
}
/* Increase width of elements in twoper
   columns to provide better alignment */
.compactform .twoper input.text,
.compactform .twoper select,
.compactform .twoper textarea {
    width:95%;
}
.compactform div {
    width:99%;
    margin-bottom:1em; /* space between rows */
    clear:both;
}
/* Nested divs shouldn't clear floated elements */
/* keeps nested divs from compounding margin value */
.compactform div div {
    margin-bottom:0;
    clear:none;
}
/* Nested div label contents should determine their own width */
.compactform div div label {
    width:auto;
    white-space:normal;
    /* unccomment to stack form inputs inside a row */
    /* clear:left; */
    margin-right:1em;
}
/* Fix paragraph white space in Safari */
.compactform div div p {
    margin:0;
    padding:0;
}

/* Compact layout - Set item width within rows */
.oneper label, .oneper div     { width:99%; } /* can't be 100%, IE bug */
.twoper label, .twoper div     { width:46%; }
.threeper label, .threeper div { width:32%; }
.fourper label, .fourper div   { width:23%; }
.fiveper label, .fiveper div   { width:19%; }
.sixper label, .sixper div     { width:15%; }
.sevenper label, .sevenper div { width:13%; }
.eightper label, .eightper div { width:11%; }
.nineper label, .nineper div   { width:10%; }
.tenper label, .tenper div     { width:8.7%; }

.oneper label, .oneper div,
.twoper label, .twoper div,
.threeper label, .threeper div,
.fourper label, .fourper div,
.fiveper label, .fiveper div,
.sixper label, .sixper div,
.sevenper label, .sevenper div,
.eightper label, .eightper div,
.nineper label, .nineper div,
.tenper label, .tenper div {
    white-space:nowrap;
    overflow:hidden;
    border:none;
    border-collapse:collapse;
}

/** *************************************************************************
 * Browser hacks
*/

/* Keep containers holding only floated elements from collapsing in Safari */
.clearfix:after {
    content:".";
    display:block;
    height:0;
    clear:both;
    visibility:hidden;
}

